<template>
	<view class="">
		<u-navbar :border-bottom="false">
			<u-search @click="toSearch" @search="toSearch" placeholder="请输入关键词检索" disabled :show-action="false"
				v-model="keyWord"></u-search>
		</u-navbar>
		<view class="shopCart" @click="toShopCart">
			<u-badge absolute :offset="[5,0]" size="mini"
				:count="numAll" type="error">
			</u-badge>
			<image src="@/static/gwc.png" style="width: 88rpx;height: 88rpx;"></image>
		</view>
		<view class="search-content" v-if="menuGoods.length">
			<view class="item df jcsb aic " v-for="(item,index) in menuGoods" :key="item.platformGoodsId">
				<view class="df aic" @click="handleDetail(item)">
					<u-image :src="item.images&&item.images.split(',')[0]" width="158" height="158"
						borderRadius="10"></u-image>
				</view>
				<view class="" style="width: 470rpx;">
					<view class="c3 fs28 u-line-2 " style="font-weight: bold;" @click="handleDetail(item)">{{item.customGoodsName}}</view>
					<view class="goodsLabel " style="margin-top: 10rpx;" >
							{{item.platformGoodsSpecMix&&item.platformGoodsSpecMix[0].specName}}
					</view>
					<view class="c9 fs22 mt10" @click="handleDetail(item)">{{item.introduce||''}}</view>
					<view  class="df aic price  fwb " v-if="TOKEN&&item.referencePriceRange && item.referencePriceRange!='0.00' &&$common.calcTime(item.startTime,item.endTime)">
						<text class="fs24">单价:</text> <text
							class="fs28">{{item.referencePriceRange}}</text>
					</view>
					<view class="df aic jcsb c3 fs24">
						<view class="price df aic" v-if="TOKEN">
							<Vip class="mr5"  v-if="item.priceRangeOne&&TOKEN&&$common.calcTime(item.startTime,item.endTime)"></Vip>
							<text class="fw4 price fs22">¥</text><text
								class="fw5 price fs30">{{$common.calcTime(item.startTime,item.endTime)?item.priceRange||0:'待报价'}}</text>
							<!-- <text class="c3 fs22">/份</text> -->
						</view>
						<view class="df aic fs26 fwb" style="color: #EF2929;" v-else>
							登录可见价格
						</view>
						
						<nmr-icon v-if="!TOKEN && $common.calcTime(item.startTime,item.endTime)" @click="handleLogin" name="jiatianjia-yuankuang" size="40"
							color="#47A848"></nmr-icon>
						<view class="pr" v-else>
							<zm-number-box
							:saleUnit="item.platformGoodsSpecMix[0].saleUnit"
							 :startSaleNum="item.platformGoodsSpecMix[0].startSaleNum" :step="item.platformGoodsSpecMix[0].startSaleNum&&item.platformGoodsSpecMix[0].isDouble==1?item.platformGoodsSpecMix[0].startSaleNum:1" :disabledInput="item.platformGoodsSpecMix[0].isDouble==1" 
							 v-if="item.platformGoodsSpecMix.length==1 && $common.calcTime(item.startTime,item.endTime)" size="36"
								@change.stop="valChange($event,item)" :min="0"
								v-model="item.platformGoodsSpecMix[0].purNum" v-else></zm-number-box>
							<!-- 多规格的情况下 需要选择规格 -->
							<view class="pr" v-if="item.platformGoodsSpecMix.length!=1 && $common.calcTime(item.startTime,item.endTime)"
								@click.native.stop="chooseSkuShow(item,index)">
								<badge :item="item"></badge>
								<!-- <nmr-icon name="jiatianjia-yuankuang" size="40" color="#47A848"></nmr-icon> -->
								<view class="fs22 df aic jcc spce-box" >
									选规格
								</view>
							</view>
						</view>
					</view>
					<view class="text-under c9 fs24 ml5" v-if="item.priceRangeOne&&TOKEN&&$common.calcTime(item.startTime,item.endTime)">原价:￥{{item.priceRangeOne}}</view>
				</view>
			</view>
			<u-loadmore style="width: 100%;" v-if="menuGoods.length!=0" margin-top="20" margin-bottom="30"
				:status="loadStatus" :load-text="loadText" />
		</view>
		<view class="empty" v-else>
			<view class="u-text-center">
				<image src="../../static/empty/search-empty.png" style="width: 389rpx;height: 320rpx;" mode="widthFix">
				</image>
				<view class="fs30 c6 fwb">
					搜索结果为空~
				</view>
				<view class="fs24 c9 mt8">
					请搜索其他关键词试试哦~
				</view>
			</view>
		</view>
		<LoginPopup ref="LoginPopup"></LoginPopup>
		<!-- <SkuPopup @change="changeSku" v-model="showSku" :info="skuInfo"></SkuPopup> -->
		<SkuPopup @changeCarList="changeCarList" :goodsCarList="goodsCarList" @change="changeSku" v-model="showSku"
			:info="skuInfo"></SkuPopup>
	</view>
</template>

<script>
	import {
		platformGoodsList
	} from '@/api/goods.js'
	import badge from './components/badge.vue'
	export default {
		components: {
			badge
		},
		data() {
			return {
				keyWord: '',
				menuGoods: [],
				loadStatus: 'loadmore',
				pageNum: 1,
				pageSize: 40,
				loadText: {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '没有更多了'
				},
				skuInfo: {},
				index: 0,
				showSku: false,
				goodsCarList: [],
				numAll:0,
				source:undefined,
				supplierModel:''
			}
		},
		onLoad(e) {
			
			this.keyWord = e.keyWord&&e.keyWord||''
			this.source = e.source&&e.source||''
			this.supplierModel = e.supplierModel&&e.supplierModel||''
			this.goodsCarList = uni.getStorageSync('CARGOODLIST')
			this.getList()
		},
		onShow() {
			this.goodsCarList = uni.getStorageSync('CARGOODLIST')
			let num = this.$common.clacCount(this.goodsCarList)
			this.numAll = num
			this.clacGoodsSet()
		},
		
		onReachBottom() {
			this.getList()
		},
		methods: {
			async clacGoodsSet() {
				if(!this.menuGoods.length)return
				let list = await this.clacGoods(this.menuGoods)
				this.menuGoods = list
				this.$forceUpdate()
			},
			valChange(e, item) {
				this.$set(item.platformGoodsSpecMix[0], 'purNum', e)
				this.handleCart(item.platformGoodsSpecMix[0])
			},
			handleCart(e) {
				let goodsCarList = this.goodsCarList || []
				let index = goodsCarList.findIndex(i => i.platformGoodsSpecMixId == e.platformGoodsSpecMixId)
				if (index == -1) { //购物车中没有这个商品  新增操作
					goodsCarList.unshift(e)
				} else { //购物车中有这个商品  修改操作
					if (e.purNum == 0) { //删除操作
						goodsCarList.splice(index, 1)
					} else {
						//只有購物車的時候 才手動更新列表
						goodsCarList[index].purNum = e.purNum
						goodsCarList[index].busType = ''
						goodsCarList[index].platformPrice = e.platformPrice
					}
				}
				this.changeCarList(goodsCarList)
			},
			changeSku(info) {
				this.menuGoods[this.index] = info
			},
			toShopCart(){
				uni.switchTab({
					url:'/pages/shopping/index'
				})
			},
			changeCarList(e) {
				this.goodsCarList = e
				uni.setStorageSync('CARGOODLIST',this.goodsCarList)
				// this.$u.vuex('CARGOODLIST', this.goodsCarList)
				let num = this.$common.clacCount(e)
				this.numAll = num
				if (num == 0) {
					uni.removeTabBarBadge({
						index: 3
					})
				} else {
					uni.setTabBarBadge({
						index: 3,
						text: num
					})
				}
			},
			chooseSkuShow(item, index) {
				this.skuInfo = item
				this.index = index
				this.showSku = true
			},
			handleLogin() {
				this.$refs.LoginPopup.checkLogin()
			},
			init() {
				this.loadStatus = 'loadmore'
				this.pageNum = 1
				this.pageSize = 40
				this.menuGoods = []
			},
			clacGoods(list) {
				return new Promise((resolve, reject) => {
					list.forEach(e => {
						e.platformGoodsSpecMix.forEach(mix => {
							let info = this.goodsCarList.find(_e => _e.platformGoodsSpecMixId ===
								mix
								.platformGoodsSpecMixId)
							if (info) {
								this.$set(mix, 'purNum', info.purNum)
								this.$set(mix, 'checkFlag', true)
							} else {
								this.$set(mix, 'purNum', 0)
								this.$set(mix, 'checkFlag', true)
							}
						})

					})
					resolve(list)
				})
			},
			getList() {
				if (this.loadStatus == 'nomore' || this.loadStatus == 'loading') return
				this.loadStatus = 'loading'
				platformGoodsList({
					keywords: this.keyWord,
					pageNum: this.pageNum,
					pageSize: this.pageSize,
					flag:'normal',
					source:this.source,
					supplierModel:this.supplierModel
				}).then(async res => {
					if (res.code == 200) {
						let list = await this.clacGoods(res.rows)
						this.menuGoods.push(...list)
						this.pageNum = ++this.pageNum;
						if (res.rows.length < this.pageSize) {
							this.loadStatus = 'nomore' //不用加载下一页
						} else {
							this.loadStatus = 'loadmore' //不用加载下一页
						}
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none',
							mask: true
						})
					}
				})
			},
			handleDetail(e) {
				uni.navigateTo({
					url: '/pages/goods/detail?id=' + e.platformGoodsId
				})
			},
			toSearch() {
				uni.redirectTo({
					url: '/pages/search/index'
				})
			}
		}
	}
</script>

<style>
</style>
<style lang="scss" scoped>
	
	.search-content {
		margin: 20rpx 30rpx;

		.item {
			background: #FFFFFF;
			padding: 20rpx;
			margin-bottom: 20rpx;
			border-radius: 20rpx;
		}
	}

	.empty {
		height: calc(100vh - var(--status-bar-height) - 44px);
		background-color: white;
		padding-top: 250rpx;

		.go-home {
			width: 160rpx;
			height: 58rpx;
			background: linear-gradient(90deg, #48A147 0%, #8AE38A 100%);
			border-radius: 34rpx 34rpx 34rpx 34rpx;
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			margin: 0 auto;
			margin-top: 30rpx;
		}
	}
	.shopCart{
		position: fixed;
		bottom: 120rpx;
		right: 20rpx;
		z-index: 9;
		
	}
</style>